<div class="news">
  <h2><b>News</b></h2>
  {% if site.news  %}
    <div class="table-responsive">
      <table class="table table-sm table-borderless">
      {% assign news = site.news | reverse %}
      {% for item in news limit: site.news_limit %}
        <tr>
          <th scope="row">
            <abbr class="badge" style="display:inline-block; width:80px; background-color:var(--global-theme-color);">
              <span style="background-color: transparent; color: var(--global-bg-color);">
                {{ item.date | date: "%b %-d, %Y" }}
              </span>
            </abbr>
          </th>
          <td>
            {% if item.inline %}
              {{ item.content | remove: '<p>' | remove: '</p>' | emojify }}
            {% else %}
              <a class="news-title" href="{{ item.url | relative_url }}">{{ item.title }}</a>
            {% endif %}
          </td>
        </tr>
      {% endfor %}
      </table>
    </div>
  {% else %}
    <p>No news so far...</p>
  {% endif %}
</div>
